<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<meta name="description" content="" />
		<meta name="author" content="" />
		<title>专题</title>
		<link rel="stylesheet" href="lib/bootstrap-3.3.7-dist/css/bootstrap-theme.min.css" />
		<link rel="stylesheet" href="lib/bootstrap-3.3.7-dist/css/bootstrap.min.css" />
		<link rel="stylesheet" href="css/common.css" />
		<link rel="stylesheet" href="css/sidebar.css" />
		<link rel="stylesheet" href="css/SpecialTopic.css" />
		<link rel="stylesheet" href="css/mobile.css" />
		<script src="lib/jQuery/jquery-3.1.1.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/sidebar.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<body>
		<div id="wrapper">
			<!--头部  banner  start-->
			<div class="banner">
				<div class="container">
					<form action="" method="post">
						<div class="form-group pull-right topbar-search">
							<div class="input-group">
						        <input type="text" class="form-control" id="exampleInputAmount" placeholder="请输入搜索内容">
						        <div class="input-group-addon"><i class="glyphicon glyphicon-search"></i></div>
						    </div>
						</div>
					</form>
				</div>
			</div>
			<!--头部 banner end-->
			
			<!--导航 start-->
			<div class="nav-bar nav-bg-gradient clearfix">
				<div class="navbar-left gradient pull-left">
					<a href="JavaScript:;">首页</a>
				</div>
				<div class="navbar-center pull-left">
					<ol class="breadcrumb">
						<li>
							<a href="">排行榜</a>
						</li>
						<li>
							<a href="">活跃人物排行</a>
						</li>
					</ol>
				</div>
				<div class="nav-bar-right pull-right">
					<span class="glyphicon glyphicon-th-list"></span>
				</div>
			</div>
			<!--导航 end-->
			
			<!--侧边菜单栏  start-->
			<div class="side-menu">
				<div id="sidebar-menu">
					<ul>
						<li>
							<a href="JavaScript:;">
								<span>排行榜</span>
								<span class="glyphicon glyphicon-menu-left pull-right"></span>
							</a>
							<ul class="list-unstyled">
								<li>
									<a href="JavaScript:;">
										<i class="blue-square"></i>
										<span>活跃人物排行</span>
									</a>
								</li>
								<li>
									<a href="JavaScript:;">
										<i class="blue-square"></i>
										<span>最热文章排行</span>
									</a>
								</li>
								<li>
									<a href="JavaScript:;">
										<i class="blue-square"></i>
										<span>分类排行</span>
									</a>
								</li>
							</ul>
						</li>
						
						<li>
							<a href="JavaScript:;">
								<span>重点人群信息</span>
								<span class="glyphicon glyphicon-menu-left pull-right"></span>
							</a>
							<ul class="list-unstyled">
								<li>
									<a href="JavaScript:;">
										<i class="blue-square"></i>
										<span>律师</span>
									</a>
								</li>
								<li>
									<a href="JavaScript:;">
										<i class="blue-square"></i>
										<span>学者</span>
									</a>
								</li>
								<li>
									<a href="JavaScript:;">
										<i class="blue-square"></i>
										<span>媒体人</span>
									</a>
								</li>
								<li>
									<a href="JavaScript:;">
										<i class="blue-square"></i>
										<span>大V</span>
									</a>
								</li>
								<li>
									<a href="JavaScript:;">
										<i class="blue-square"></i>
										<span>民运人士</span>
									</a>
								</li>
								<li>
									<a href="JavaScript:;">
										<i class="blue-square"></i>
										<span>民族</span>
									</a>
								</li>
								<li>
									<a href="JavaScript:;">
										<i class="blue-square"></i>
										<span>其他（涉案）</span>
									</a>
								</li>
							</ul>
						</li>
						
						<li>
							<a href="JavaScript:;">
								<span>专题</span>
							</a>
						</li>
						<li>
							<a href="JavaScript:;">
								<span>辅助功能</span>
							</a>
						</li>
						<li>
							<a href="JavaScript:;">
								<span>预警</span>
							</a>
						</li>
						<li>
							<a href="JavaScript:;">
								<span>简报</span>
							</a>
						</li>
					</ul>
				</div>
			</div>
			<!--侧边菜单栏 end-->
			
			<!--内容  start-->
			<div class="section">
				<div class="content-page">
					<div class="container">
						<div class="row">
							<p class="pull-left margin-right-15 line-height-30">专题标签</p>
							<ul class="nav nav-pills">
							    <li role="presentation" class="active"><a href="#">财经专题</a></li>
							    <li role="presentation"><a href="#">证券专题</a></li>
							    <li role="presentation"><a href="#">产经专题</a></li>
							    <li role="presentation"><a href="#">会议专题</a></li>
							    <li role="presentation"><a href="#">消费专题</a></li>
							    <li role="presentation"><a href="#">其他专题</a></li>
							</ul>
						</div>
						<div class="row">
							<div class="panel panel-default margin-top-15">
							    <div class="panel-heading">
							      <h3 class="panel-title">专题聚焦</h3>
							      <p>
							      	
							      </p>
							    </div>
							    <div class="panel-body">
							        <div class="row topic-list">
							        	<div class=" col-md-4 col-sm-6 col-xs-12 margin-bottom-15">
							        		<div class="list-item-content clearfix">
							        			<div class="topic-list-picture pull-left margin-right-15">
								        			<img src="img/SpecialTopic/topic.png" alt="" />
								        		</div>
								        		<div class="pull-left toptic-describe">
								        		    <h4 class="topic-title line-height-30">财经专题</h4>
								        		    <p class="margin-bottom-10">创建时间：<span>2016-09-20</span></p>
								        		    <p>
								        		    	<span class="label label-primary topic-label">财政专题</span>
								        		    	<i class="glyphicon glyphicon-edit pull-right"></i>
								        		    </p>
								        		</div>
							        		</div>
							        	</div>
							        	<div class=" col-md-4 col-sm-6 col-xs-12 margin-bottom-15">
							        		<div class="list-item-content clearfix">
							        			<div class="topic-list-picture pull-left margin-right-15">
								        			<img src="img/SpecialTopic/topic.png" alt="" />
								        		</div>
								        		<div class="pull-left toptic-describe">
								        		    <h4 class="topic-title line-height-30">财经专题</h4>
								        		    <p class="margin-bottom-10">创建时间：<span>2016-09-20</span></p>
								        		    <p>
								        		    	<span class="label label-primary topic-label">财政专题</span>
								        		    	<i class="glyphicon glyphicon-edit pull-right"></i>
								        		    </p>
								        		</div>
							        		</div>
							        	</div>
							        	<div class=" col-md-4 col-sm-6 col-xs-12 margin-bottom-15">
							        		<div class="list-item-content clearfix">
							        			<div class="topic-list-picture pull-left margin-right-15">
								        			<img src="img/SpecialTopic/topic.png" alt="" />
								        		</div>
								        		<div class="pull-left toptic-describe">
								        		    <h4 class="topic-title line-height-30">财经专题</h4>
								        		    <p class="margin-bottom-10">创建时间：<span>2016-09-20</span></p>
								        		    <p>
								        		    	<span class="label label-primary topic-label">财政专题</span>
								        		    	<i class="glyphicon glyphicon-edit pull-right"></i>
								        		    </p>
								        		</div>
							        		</div>
							        	</div>
							        	<div class=" col-md-4 col-sm-6 col-xs-12 margin-bottom-15">
							        		<div class="list-item-content clearfix">
							        			<div class="topic-list-picture pull-left margin-right-15">
								        			<img src="img/SpecialTopic/topic.png" alt="" />
								        		</div>
								        		<div class="pull-left toptic-describe">
								        		    <h4 class="topic-title line-height-30">财经专题</h4>
								        		    <p class="margin-bottom-10">创建时间：<span>2016-09-20</span></p>
								        		    <p>
								        		    	<span class="label label-primary topic-label">财政专题</span>
								        		    	<i class="glyphicon glyphicon-edit pull-right"></i>
								        		    </p>
								        		</div>
							        		</div>
							        	</div>
							        </div>
							    </div>
							    <!--分页-->
								<div class="row text-center">
									<nav aria-label="Page navigation">
									  <ul class="pagination">
									    <li>
									      <a href="#" aria-label="Previous">
									        <span aria-hidden="true">&laquo;</span>
									      </a>
									    </li>
									    <li><a href="#">1</a></li>
									    <li><a href="#">2</a></li>
									    <li><a href="#">3</a></li>
									    <li><a href="#">4</a></li>
									    <li><a href="#">5</a></li>
									    <li>
									      <a href="#" aria-label="Next">
									        <span aria-hidden="true">&raquo;</span>
									      </a>
									    </li>
									  </ul>
									</nav>
								</div>
							</div>
						</div>
						
				    </div>
				</div>
			</div>
		</div>
	</body>
</html>

